import React from "react";
import styles from '@/assets/css/hotel-info.module.css';
import { TMap } from '@map-component/react-tmap';

const About = () => {

    const [ HotList, SetHotList ] = React.useState([]);

    useEffect(() => 
    {
        GetHotelData();
    },[]);

    const GetHotelData = async () => 
    {
        let result = await React.Http.post('/room/about');
        
        if(result.code == 1)
        {
            SetHotList(result.data);
        }
    }

    return(
        <>
            <div className={styles.heaerd}>
                <React.UI.Swiper loop autoplay>
                    {
                        HotList.map((item: any) => {
                            return (
                                <React.UI.Swiper.Item>
                                    <NavLink to={`/room/info/${item.id}`} >
                                        <React.UI.Image src={item.thumb_text} height={213} fit='cover' />
                                    </NavLink>
                                </React.UI.Swiper.Item>
                            )
                        })
                    }
                </React.UI.Swiper>
            </div>
            <div className={styles.hotelinfo}>
                <div className={styles.hotelinfo_title}>
                    创想第一门店
                </div>
                <div className={styles.hotelinfo_address}>
                    广东省深圳市福田区华强北街道振兴路341号上步工业区
                </div>
                <div className={styles.hotelinfo_desc}>
                    <div className={styles.desc_title}>简介</div>
                    <div>这里是极速创想第一门店</div>
                </div>
                <div className={styles.hotelinfo_desc}>
                    <div className={styles.desc_title}>详情</div>
                    <div>这里是极速创想第一门店，欢迎你的预订入住</div>
                </div>
                <div className={styles.map}>
                    <TMap
                        mapKey="TOZBZ-OU2CX-JJP4Z-7FCBV-CDDJ2-AHFQZ"
                        center={{ lat: 39.984104, lng: 116.307503 }}
                        version='1.exp'
                    />
                </div>
            </div>
        </>
    )
}

export default About;